/*
 * @Author: szx
 * @Date: 2022-03-13 14:44:37
 * @LastEditTime: 2022-03-13 16:01:02
 * @Description:
 * @FilePath: \learn\MDN_JS学习\八股文\防抖和节流\debounce.js
 */
var count = 1;
var container = document.getElementById('container');

function getUserAction() {
    container.innerHTML = count++;
}

// 第一版
// function debounce(fn, wait) {
//     // 闭包，一直保留着timeout
//     let timeout = null;
//     return function () {
//         // 每当用户输入的时候把前一个 setTimeout clear 掉
//         clearTimeout(timeout);
//         // 然后又创建一个新的 setTimeout, 这样就能保证输入字符后的 interval 间隔内如果还有字符输入的话，就不会执行 fn 函数
//         timeout = setTimeout(() => {
//             // this 确保当前指向的对象是调用函数的对象，如 input 对象
//             fn.apply(this, arguments);
//         }, wait);
//     };
// }

// 第二版
function immedDebounce(fn, wait, immediate) {
    let timeout = null;
    return function () {
        if (timeout) clearTimeout(timeout);
        if (immediate) {
            if (timeout == null) {
                fn.apply(this, arguments);
            }
            timeout = setTimeout(() => {
                timeout = null;
            }, wait);
        } else {
            timeout = setTimeout(fn.apply(this, arguments), wait);
        }
    };
}

container.onmousemove = immedDebounce(getUserAction, 1000, true);
